{include file="public/header" /}
<style>
    body,
    #tables {
        background: #fff
    }

    .title {
        /*background: #fff001;*/
        max-width: 200px;
        font-weight: bold;
    }

    .layui-table .center {
        min-width: 150px;
        overflow: hidden;
    }

    .layui-table td,
    .layui-table th {
        border-color: #000000;
    }

    .layui-input {
        border: none;
    }


    .btns {
        width: 80px;
        background: #1E9FFF;
        color: #fff;
        text-align: center;
        margin: auto;
        padding: 10px;
        border-radius: 10px;
        margin-bottom: 100px;
    }

    .layui-form-pane .layui-input {
        background-color: transparent;
        width: 100%;
        height: 100%;
        font-size: 12px;
        text-align: center;
    }
</style>

<body>
    <form action="" method="post" class="layui-form layui-form-pane">
        <div class="layui-fluid" id="tables">
            <h1 style="padding:10px 0;text-align:center;font-weight:bold">一般员工绩效考核表(通用版)</h1>
            <div class="layui-form">
                <table class="layui-table" align="center" lay-size="sm">
                    <tr>
                        <td rowspan="3" colspan="2" class="title" align="center">考核项目</td>
                        <td rowspan="3" colspan="2" class="title" align="center">细分指标</td>
                        <td rowspan="3" class="title" align="center">权重(分)</td>
                        <td rowspan="3" colspan="4" class="title" align="center">指标具体内容及定义</td>
                        <td colspan="5" class="title" align="center">评分标准</td>
                        <td rowspan="3" class="title" align="center">自我评价得分</td>
                        <td rowspan="3" class="title" align="center">考核评价得分</td>
                        <td rowspan="3" class="title" align="center">综合得分</td>
                    </tr>
                    <tr>
                        <td class="title" align="center">A</td>
                        <td class="title" align="center">B</td>
                        <td class="title" align="center">C</td>
                        <td class="title" align="center">D</td>
                        <td class="title" align="center">E</td>
                    </tr>
                    <tr>
                        <td class="title" align="center">100%</td>
                        <td class="title" align="center">80%</td>
                        <td class="title" align="center">60%</td>
                        <td class="title" align="center">40%</td>
                        <td class="title" align="center">20%</td>
                    </tr>
                    {foreach $list as $k => $row}
                    {foreach $row.data as $ks => $data}
                    <tr>
                        {if $ks == 0}<td class="title" colspan="2" rowspan="{:count($row.data)}" align="center">
                            {$row.name|default=''}</td>{/if}
                        <td colspan="2" align="center">{$data.title|default=''}</td>
                        <td align="center">{$data.branch|default=''}</td>
                        <td colspan="4" align="center">{$data.descs|default=''}</td>
                        <td align="center">A</td>
                        <td align="center">B</td>
                        <td align="center">C</td>
                        <td align="center">D</td>
                        <td align="center">E</td>
                        <td align="center"><input type="text" name="data[ziwo][{$data.id}]"
                                value="{$user.ziwo[$data.id]|default=''}" class="layui-input" /></td>
                        <td align="center"><input type="text" name="data[pingjia][{$data.id}]"
                                value="{$user.pingjia[$data.id]|default=''}" class="layui-input" /></td>
                        <td align="center"><input type="text" name="data[zonghe][{$data.id}]"
                                value="{$user.zonghe[$data.id]|default=''}" class="layui-input" /></td>
                    </tr>
                    {/foreach}
                    {/foreach}
                </table>
            </div>
        </div>
        <input type="hidden" value="{$id|default='0'}" name="id" />
        <div style="margin:50px auto;width:500px">
            <button style="border: none;" class="btns" lay-submit="" lay-filter="add">提交保存</button>
            <!-- <button style="border: none;" class="btns" onclick="doPrint()">(打印前请先保存)</button> -->
        </div>
    </form>
    {include file="public/footer" /}
    <script>
        layui.use(["form", "layer", "upload"], function () {
            $ = layui.jquery;
            var form = layui.form,
                upload = layui.upload,
                element = layui.element,
                layer = layui.layer;
            //监听提交
            form.on("submit(add)", function (data) {
                $.ajax({
                    type: "post",
                    data: data.field,
                    success: function (res) {
                        if (res.status == 0) {
                            layer.msg(res.msg, { icon: 6, time: 1000 }, function () {
                                location.reload();
                            });
                        } else {
                            layer.msg(res.msg, { icon: 2, time: 1000 });
                        }
                    },
                });
                return false;
            });
        });
        function doPrint() {
            var head_str = "<html><head><title></title></head><body>"; //先生成头部
            head_str += '<style>body{font-size:12px}.layui-input {font-size: 12px;padding: 0;margin: 0}table{border-collapse:collapse;border-spacing:0;width:100%}</style>';
            var foot_str = "</body></html>"; //生成尾部
            var older = document.body.innerHTML;
            var new_str = document.getElementById('tables').innerHTML; //获取指定打印区域
            var old_str = document.body.innerHTML; //获得原本页面的代码
            console.log(head_str + new_str + foot_str);
            document.body.innerHTML = head_str + new_str + foot_str; //构建新网页
            window.print(); //打印刚才新建的网页
            document.body.innerHTML = older; //将网页还原
            return false;
        }
    </script>
</body>

</html>